<script setup>
import {defineProps} from 'vue'
const props = defineProps(['hotelList'])
</script>

<template>
<div class="recommend-list">
    <ul>
        <li v-for="v in props.hotelList" :key="v.id">
            <div class="list-left">
                <div class="list-left-img">
                    <img :src="`/images/${v.img_url}`" alt="">
                </div>
                <div class="list-left-title">
                    <div class="list-left-tagandtitle">
                        <h4>{{v.name}}</h4>
                        <img :src="`/images/${v.starimg_url}`" alt="">
                        <span class="badge-thumb"></span>
                    </div>
                    <div class="list-left-transport">
                        <p>{{v.transport}}</p>
                    </div>
                    <div class="list-left-tag">
                        <el-tag class="ml-2" type="danger" effect="plain" v-for="(k,i) in v.tag" :key="i">{{k}}</el-tag>
                    </div>
                </div>
            </div>
            <!-- 右侧 -->
            <div class="list-right">
                <div class="list-right-comment">
                    <div class="list-right-describe">
                        <p>好</p>
                        <a href="#">3333条点评</a>
                    </div>
                    <div class="list-right-score">
                        <p>4.5</p>
                    </div>
                </div>
                <div class="list-right-price">
                    <p>￥3333</p>
                     <el-button type="primary">查看详情</el-button>
                </div>
            </div>
        </li>


    </ul>
</div>

</template>

<style scoped>

</style>
